<?php
/*
Template Name: Calculator Visual
*/
?>

<?php get_header(); ?>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>


<!-- Map Header -->
<div class="pageheader">
<?php the_post_thumbnail( array (687,265) );?>
<div class="pageheader-caption">
<?php the_post_thumbnail_caption(); ?>
</div>
</div>

<!-- Sidebar -->
<div class="pagesidebar">
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar("Sidebar") ) : ?><?php endif; ?>
 
  <?php if (!empty($sid) && function_exists('is_dynamic_sidebar') && is_active_sidebar($sid)){ ?>
    <div id="sidebar">  
      <?php if (!function_exists('dynamic_sidebar') || !dynamic_sidebar($sid)): ?><?php endif; ?>
    </div>
  <?php } ?>
</div>

<!-- Content Area -->
<div class="pagecontent">

<?php the_content(); ?>

<div class="calculatorinformation">
<h1>Customer Information</h1>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et tempus nibh. In posuere dapibus laoreet.</p> 

<form style="margin-top:20px;">
		<input type="text" name="#" value="Hours in building (daily)" class="calculatorform3"><input type="text" name="#" value="Number of required mops and tissues (daily)" class="calculatorform3"><input type="text" name="#" value="Type and size mops" class="calculatorform3"></br>
		</form>

</div>
<div class="arrow-down"></div>

<div class="calculatorinformation">
<h1>Billing Information</h1>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et tempus nibh. In posuere dapibus laoreet.</p> 

<form style="margin-top:20px;">
		<input type="text" name="#" value="Water costs" class="calculatorform2"><input type="text" name="#" value="Energy costs" class="calculatorform2"></br>
		</form>

</div>
<div class="arrow-down"></div>

<div class="calculatorinformation">
<h1>Contract Information</h1>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et tempus nibh. In posuere dapibus laoreet. </p>

<form style="margin-top:20px;">
		<input type="text" name="#" value="Preparation required" class="calculatorform3"><input type="text" name="#" value="Dosing system required" class="calculatorform3"><input type="text" name="#" value="Designated contract duration" class="calculatorform3"></br>
		</form>

</div>
<div class="arrow-down"></div>

<div class="calculator-result">
	<div class="calculator-result-right">
<h1>Calculation Results</h1>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et tempus nibh. In posuere dapibus laoreet.</p>

<div class="result-box1">
<div class="amount">£2015</div>
<p>Cost efficient machine capacity and quantity of required machines</p>
</div>

<div class="result-box2">
<div class="amount">£33.34</div>
<p>Costs per mop/costs per tissue</p>


</div>
</div>
</div>
</div>
<?php endwhile; else: ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>






<div class="clear"></div>
<?php get_footer(); ?>